<template>
  <div class="container">
      <van-form>
        <div class="qiye-info">
            <div class="title">单位信息</div>
            <van-cell-group inset>
                <van-field
                v-model="form.companyName"
                name="companyName"
                label="单位名称："
                placeholder=""
                readonly
                />
                <van-field
                v-model="form.uscc"
                name="uscc"
                label="信用代码："
                placeholder=""
                readonly
                />
                <van-field
                v-model="form.legalPerson"
                name="legalPerson"
                label="法人代表："
                placeholder=""
                readonly
                /> 

                <van-field
                v-model="form.companyStatusLabel"
                is-link
                readonly
                label="经营状态："
                placeholder=""
              />

                <van-field
                v-model="form.companyTypeLabel"
                is-link
                readonly
                label="单位类型："
                placeholder=""
                />

                <van-field
                v-model="form.companyIndustry"
                name="companyIndustry"
                label="所属行业："
                placeholder=""
                readonly
                />

                <van-cell title="成立日期：" :value="form.startDate" />
                <van-field
                v-model="form.registeredCapital"
                name="registeredCapital"
                label="注册资本："
                placeholder=""
                readonly
                />
                <van-field
                v-model="form.paidCapital"
                name="paidCapital"
                label="实缴资本："
                placeholder=""
                readonly
                />
                <van-field
                v-model="form.creditRating"
                name="creditRating"
                label="信用评级："
                placeholder=""
                readonly
                />
                <van-cell title="营业期限：" :value="form.endDate" />
                <van-field
                v-model="form.registrationAuthority"
                name="registrationAuthority"
                label="登记机关："
                placeholder=""
                readonly
                />
                <van-field
                v-model="form.registeredAddress"
                name="registeredAddress"
                label="注册地址："
                placeholder=""
                readonly
                />
                <van-field
                v-model="form.postcode"
                name="postcode"
                label="邮编："
                placeholder=""
                readonly
                />
                <van-field
                v-model="form.phone1"
                name="phone1"
                label="联系电话："
                placeholder=""
                readonly
                />
                <van-field
                v-model="form.fax"
                name="fax"
                label="传真："
                placeholder=""
                readonly
                />
                <van-field
                v-model="form.email"
                name="email"
                label="电子邮件："
                placeholder=""
                readonly
                />
            </van-cell-group>
        </div>
        <div class="qita">
            <div class="title2">其他</div>
            <div class="title3">单位信息备注：</div>
            <van-field
            class="remark"
            type="textarea"
            :rows="3"
            v-model="form.remark"
            readonly
            name="email"
            label=""
            placeholder=""
            />
        </div>

        <div class="qiye-info2" v-if="comContaceList.length">
            <div class="title">联系人信息</div>
            <van-cell-group inset v-for="(item, index) of comContaceList" :key="index">
              <div class="gzjl">联系人{{index+1}}信息: </div>
                <van-field
                v-model="item.name"
                label="姓名："
                placeholder=""
                readonly
                />
                <van-field
                v-model="item.sex"
                label="性别："
                readonly
                placeholder=""
                />
                <van-cell title="生日：" :value="item.birthday" />
                <van-field
                v-model="item.department"
                label="部门："
                readonly
                placeholder=""
                />
                <van-field
                v-model="item.job"
                label="职务："
                readonly
                placeholder=""
                />
                <van-field
                v-model="item.officeTelephone"
                label="办公电话："
                readonly
                placeholder=""
                />
                <van-field
                v-model="item.phone"
                label="手机号："
                readonly
                placeholder=""
                />
                <van-field
                v-model="item.email"
                label="电子邮件："
                readonly
                placeholder=""
                />
                <div class="title3">联系人{{index+1}}信息备注：</div>
                <van-field
                readonly
                style="margin-bottom: 2rem;"
                class="remark"
                type="textarea"
                :rows="3"
                v-model="item.remark"
                name="remark"
                label=""
                placeholder=""
                />
            </van-cell-group>
          </div>
      </van-form>

  </div>
</template>

<script setup>
import { ref } from 'vue';
import { reactive } from 'vue';
import { useRouter,useRoute } from 'vue-router';
import { onMounted } from 'vue'
import { showToast } from 'vant';
import { getCompanyDetail,getDictSelect,editCompanyInfo,getCompanyContactList,editCompanyContact,creatCompanyContact } from '@/api/company';

const router = useRouter()
const route = useRoute(); 
const IsLxrFlag = ref(false);

//单位联系人列表
const comContaceList = ref([])
const getCompanyContact = async () => {
const { code, data } = await getCompanyContactList({
  companyId: route.query.companyId
});
// if (code === 200) {
//   var contactId = data.list[0].contactId
//   if(contactId){
//     form2.name = data.list[0].name
//     form2.department = data.list[0].department
//     form2.job = data.list[0].job
//     form2.officeTelephone = data.list[0].officeTelephone
//     form2.email2 = data.list[0].email
//     form2.phone = data.list[0].phone
//     form2.remark2 = data.list[0].remark
//     form2.birthday = data.list[0].birthday
//     form2.contactId = data.list[0].contactId
//     sexValue.value = data.list[0].sex
//   }
// }

if (code === 200 && data.list.length) {
  comContaceList.value = data.list
  }
}

//编辑单位信息
const form = reactive({
companyName: '',
uscc: '',
legalPerson: '',
companyIndustry: '',  
startDate: '',
registeredCapital: '',
paidCapital: '',
creditRating: '',
endDate: '',
registrationAuthority: '',
registeredAddress: '',
postcode: '',
phone1: '',
phone2: '',
fax: '',
email: '',
remark: '',
companyStatus: '',
companyType: '',
companyStatusLabel: '',
companyTypeLabel: '',
})

async function getDetail() {
const id = route.query.companyId || '';
const { code, data } = await getCompanyDetail(id);
if(code === 200) {
  form.companyName = data.companyName
  form.uscc = data.uscc
  form.legalPerson = data.legalPerson
  form.companyIndustry = data.companyIndustry
  form.startDate = data.startDate
  form.registeredCapital = data.registeredCapital
  form.paidCapital = data.paidCapital
  form.creditRating = data.creditRating
  form.endDate = data.endDate
  form.registrationAuthority = data.registrationAuthority
  form.registeredAddress = data.registeredAddress
  form.postcode = data.postcode
  form.phone1 = data.phone1
  form.fax = data.fax
  form.email = data.email
  form.remark = data.remark
  form.companyStatusLabel = data.companyStatusLabel
  form.companyTypeLabel = data.companyTypeLabel
}
}

//单位联系人
const form2 = reactive({
name: '',
birthday: '',
department: '',
job: '',
officeTelephone: '',
phone: '',
email2: '',
remark2: ''
})

onMounted(() => {
getDetail()
getCompanyContact()
})
</script>


<style lang="scss" scoped>
.container {
background: #f9f9f9;
overflow: hidden;
margin-bottom: 6px;
padding: 0.9rem 1.3rem;
}
.navbar {
  position: fixed;
  top: 0;
  width: 100%;
  background-color: #fff;
}
.addbtn{
position: fixed;
bottom: 2rem;
width: 92%;
left: 4%;
}
.van-form{
padding: 1.4rem 0 0 0;
}
.van-cell-group{
background: #fff;
}
.van-field{
border-bottom: 1px solid #E0E0E4;
padding: 2rem 0 1.6rem;
}
.title{
  font-size: 1.8rem;
  font-weight: 700;
  margin: 0 0 0.5rem 1.2rem;
}
.qiye-info{
  background: #fff;
  padding-top: 1.2rem;
}
.qita,.qita2{
  margin-top: 2rem;
  padding: 1.2rem;
  background: #fff;
  margin-bottom: 2.6rem;
}
.qita2{
margin-bottom: 2.6rem;
}
.title2{
  font-size: 1.8rem;
  font-weight: 700;
  margin: 0 0 1.5rem 0;
}
.title3{
  font-size: 1.4rem;
  font-weight: 400;
  margin: 2.5rem 0 1.2rem 0;
}
.remark{
  border: 1px solid #E0E0E4;
  padding: 0.4rem 1rem!important;
}

.van-cell{
border-bottom: 1px solid #E0E0E4;
padding: 2rem 0 1.6rem;
}
::v-deep .van-cell__title{
width: 8.6rem !important;
flex: none;
margin-right: 1.2rem;
}
::v-deep .van-cell__value{
text-align: left;
color: #323233;
}
.van-button{
font-size: 1.8rem;
font-weight: 400;
}
::v-deep .van-cell__right-icon{
display: none;
}
.qiye-info2{
background: #fff;
padding: 1.2rem 0;
}
.gzjl{
font-size: 1.4rem;
font-weight: 700;
margin-top: 1rem;
}
</style>